import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sgy_flutter/gen/assets.gen.dart';
import 'package:sgy_flutter/widget/app_dialog.dart';
import 'package:sgy_flutter/widget/loading_page.dart';
import 'package:sgy_flutter/widget/sgy_scaffold.dart';
import 'package:sgy_flutter/widget/shadow_container.dart';

import 'logic.dart';

class PowerOffsetPage extends StatefulWidget {
  const PowerOffsetPage({Key? key}) : super(key: key);

  @override
  State<PowerOffsetPage> createState() => _PowerOffsetPageState();
}

class _PowerOffsetPageState extends State<PowerOffsetPage> {
  final logic = Get.put(PowerOffsetLogic());

  @override
  Widget build(BuildContext context) {
    return SgyScaffold(
      title: "功率偏移调整".tr,
      child: Obx(
        () => LoadingPage(
          loading: logic.loading.value,
          child: logic.success.isFalse ? _buildNormal() : _buildSuccess(),
        ),
      ),
    );
  }

  Widget _buildSuccess() {
    return Column(
      children: [
        Assets.image.iconSuccess.image(width: 90),
        Text(
          "调整成功".tr,
          style: TextStyle(fontSize: 20, color: Color(0xff1E1E1E)),
        ).marginOnly(top: 30),
        Obx(() => Text(
          "功率偏移".tr + calcPowerOffset(logic.powerOffset.value)
              .tr,
          style: TextStyle(fontSize: 15, color: Color(0xff7a7a7a)),
        )).marginOnly(top: 14),
        Spacer(),
        Container(
          width: double.infinity,
          padding: EdgeInsets.only(bottom: 12, left: 16, right: 16),
          child: FilledButton(
            style: FilledButton.styleFrom(elevation: 2),
            onPressed: () async {
              Get.back();
            },
            child: Text(
              "确定".tr,
              style: TextStyle(fontSize: 16, color: Colors.white),
            ),
          ),
        ),
      ],
    ).marginOnly(top: 28);
  }

  String calcPowerOffset(int? powerOffset){
    final powerOffsetValue = (powerOffset ?? 0) / 10 - 100;
    if (powerOffsetValue >= 0) {
      return "${powerOffsetValue}%";
    } else {
      return "${powerOffsetValue}%";
    }
  }

  Widget _buildNormal() {
    return Column(
      children: [
        Expanded(
            child: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Material(
                type: MaterialType.transparency,
                child: Obx(
                  () => Row(
                    children: [
                      _buildCircle(
                          text: "-0.5%",
                          alignment: Alignment.centerRight,
                          widthFactor: 0.8,
                          onTap: () {
                            logic.powerOffset(
                                (logic.powerOffset.value ?? 0) - 5);
                          },
                          margin: EdgeInsets.only(right: 6)),
                      _buildCircle(
                          text: "${(logic.powerOffset.value ?? 0) / 10}%",
                          alignment: Alignment.center,
                          fontSize: 20,
                          widthFactor: 0.9),
                      _buildCircle(
                          text: "+0.5%",
                          onTap: () {
                            logic.powerOffset(
                                (logic.powerOffset.value ?? 0) + 5);
                          },
                          alignment: Alignment.centerLeft,
                          widthFactor: 0.8,
                          margin: EdgeInsets.only(left: 6)),
                    ],
                  ),
                ).paddingOnly(bottom: 8),
              ),
              Text.rich(TextSpan(children: [
                WidgetSpan(
                    child: Assets.image.iconWarning
                        .image(width: 16, height: 16)
                        .marginOnly(top: 0, right: 4)),
                TextSpan(
                    text: "此操作将影响您功率计的准确性".tr,
                    style: TextStyle(
                        fontWeight: FontWeight.normal,
                        fontSize: 14,
                        color: Color(0xff7a7a7a))),
              ])).marginOnly(top: 12, left: 16, right: 16),
            ],
          ),
        )),
        Container(
          width: double.infinity,
          padding: EdgeInsets.only(bottom: 12, left: 16, right: 16),
          child: FilledButton(
            style: FilledButton.styleFrom(elevation: 2),
            onPressed: () async {
              final result = await Get.dialog(
                  AppDialog(
                    title: null,
                    message: "此操作将影响您功率计的准确性，是否继续调整？".tr,
                    submit: "确定".tr,
                    cancel: "取消".tr,
                    onSubmit: () => Get.backLegacy(result: true),
                  ),
                  barrierDismissible: false);
              if (result == true) {
                logic.setPowerOffset();
              }
            },
            child: Text(
              "确认".tr,
              style: TextStyle(fontSize: 16, color: Colors.white),
            ),
          ),
        ),
        ShadowContainer(
          margin: EdgeInsets.only(bottom: 24, left: 16, right: 16, top: 2),
          enable: true,
          color: Colors.white,
          borderRadius: BorderRadius.circular(6),
          onTap: () async {
            final result = await Get.dialog(
                AppDialog(
                  title: null,
                  message: "此操作将恢复出厂比例因子设置".tr,
                  submit: "确定".tr,
                  cancel: "取消".tr,
                  onSubmit: () => Get.backLegacy(result: true),
                ),
                barrierDismissible: false);
            if (result == true) {
              logic.resetPowerOffset();
            }
          },
          height: 40,
          child: Center(
            child: Text(
              "恢复原厂设定".tr,
              style: TextStyle(fontSize: 16, color: Colors.black),
            ),
          ),
        ),
      ],
    );
  }

  Widget _buildCircle(
      {double widthFactor = 0.6,
      double fontSize = 14,
      required String text,
      int flex = 1,
      EdgeInsetsGeometry? padding,
      void Function()? onTap,
      EdgeInsetsGeometry margin = EdgeInsets.zero,
      AlignmentGeometry alignment = Alignment.center}) {
    return Expanded(
      flex: flex,
      child: FractionallySizedBox(
        alignment: alignment,
        widthFactor: widthFactor,
        child: Padding(
          padding: margin,
          child: AspectRatio(
            aspectRatio: 1,
            child: InkWell(
              child: Ink(
                padding: padding,
                decoration: BoxDecoration(
                  color: Get.theme.primaryColor,
                  shape: BoxShape.circle,
                  boxShadow: [
                    BoxShadow(
                        color: Colors.black26,
                        offset: Offset(0, 4),
                        blurRadius: 4)
                  ],
                ),
                child: Center(
                  child: Text(
                    text,
                    style: TextStyle(fontSize: fontSize, color: Colors.white),
                  ),
                ),
              ),
              onTap: onTap,
            ),
          ),
        ),
      ),
    );
  }

  @override
  void dispose() {
    Get.delete<PowerOffsetLogic>();
    super.dispose();
  }
}
